//
// Transmission
//
.tr-workarea undershoot,
.tr-workarea overshoot {
  border-color: transparent; // Remove black border on over- and undershoot
}

//
// Firefox and Thunderbird
//

window.background:not(.csd):not(.popup) {
  > widget {
    // for the bookmark toolbar's separators
    > separator {
      padding-top: 1px;
      margin-top: 1px;
      min-height: 2px;
      background-color: $borders_color;
    }

    // avoid black border
    > scrollbar {
      background: none;
      border: none;
      // background-clip: border-box;
    }

    // emphasize borders color
    // > scrollbar,
    > frame > border { border-color: $borders_color; }

    > entry,
    .entry { // Set for linked entrys
      // min-height: 26px;
      border-radius: $bt_radius;
      background-image: image($base_color);
      border: 1px solid $borders_color;

      &:focus { border-color: $selection_mode_bg; box-shadow: inset 0 0 0 2px $entry_highlight; }
    }

    > spinbutton {
      background-image: image($button_bg);
      border: 1px solid $borders_color;

      @if $variant == 'light' {
        &:active {
          background-image: image($bg_color);
        }
      }

      // Fixed thunderbird linked entry spinbutton border-radius.
      .entry { border-top-right-radius: 0;  border-bottom-right-radius: 0; }
    }

    > button {
      padding-top: 3px;
      padding-bottom: 3px;
    }

    > button > button {
      outline-style: none;
      border-radius: $bt_radius;

      @if $variant == 'light' {
        &:active {
          border-radius: $bt_radius;
          border: none;
          background-image: image($bg_color);
          box-shadow: inset 0 0 0 1px $borders_color;
        }
      }

      label { padding: 4px 6px; }
    }
  }

  > menu,
  > menu > menu {
    // border-radius: 0;
    background-color: $menu_bg;
  }

  > menu > menuitem {
    padding: 4px 6px;
    border-radius: 0;

    > label:disabled { color: $disabled_fg_color; }

    > radio,
    > check {
      padding: 1px;
    }
  }

  > window > menu {
    menuitem {
      transition: none; // Fixed plank menu background issue
    }
  }
}

//
// Firefox Quantum
//

#MozillaGtkWidget {
  // blend with weird toolbar backgrounds
  background-color: $bg_color;

  // FIXME: resetting child elements background is not fully functional yet
  // because WidgetStyleCache keeps holding initial background-color.
  // the stem of this incorrect colouring seems to be caused by their
  // gdk_rgba to ns_rgba conversion. I don't think theme's fault.
  .background,
  frame,
  separator,
  scrolledwindow { background-color: $base_color; }

  headerbar.titlebar {
    padding: 0 12px;
  }

  scrollbar {
    background: none;
    border: none;

    slider {
      background-color: mix($fg_color, $bg_color, 45%);
      &:hover { background-color: mix($fg_color, $bg_color, 60%); }
      &:hover:active { background-color: mix($fg_color, $bg_color, 75%); }
      &:disabled { background-color: transparent; }
    }
  }

  > window.background > menu { // context-menus
    border: none; // hide ugly double borders
    background-color: $menu_bg;
    border-radius: 2px;

    // revert to standard separators
    > separator {
      margin-top: 2px;
      margin-bottom: 2px;
      background-color: $borders_color;
    }
  }

  > widget {
    // Emphasize toolbar's border-bottom
    > frame > border { border-color: if($variant == 'light', darken($bg_color, 15%), lighten($bg_color, 20%)); }

    // For popover, entry in toolbar, etc.
    text { background-color: $bg_color; }

    // For selection, active tab indicator, etc.
    text:selected {
      // Use traditional selection style as workaround
      background-color: $selected_bg_color;
      color: $selected_fg_color;
    }

    separator { background-color: $borders_color; }

    // FIXME: this affected to popover widget as well,
    // so we can not set $lighter_bg_color to search-bar...
    > scrolledwindow > textview {
      background-color: $menu_bg;

      text {
        background-color: transparent;
        color: if($variant =='light', $text_color, #aaaaaa);

        &:selected,
        &:selected:focus,
        selection { @extend %selected_items; }
      }
    }
  }

  // remove ugly border around the menus
  menu { border: none; }
}

//
// Chrome(ium)
//

$chrome_bg_color: $bg_color;
$chrome_fg_color: $text_color;
$chrome_menu_bg_color: $menu_bg;
$chrome_menu_fg_color: $fg_color;

window.background.chromium {
  // checked-tab & toolbar & button widgets
  background-color: $chrome_bg_color;
  color: $text_color;

  headerbar.titlebar {
    padding: 0 $container_padding * 2;

    button.toggle { // account-button (> 64.0.3282?)
      border: none;
      background-color: transparent;
      background-image: none;

      &:hover { @include button(flat-hover); }
      &:checked, &:active { @include button(flat-active); }
    }

    // from nav_button_provider_gtk3.cc (> 62.0.3202?)
    button.titlebutton { // title-buttons
      // define global titlebutton class sizing
      min-width: 16px;
      min-height: 16px;
      margin: 0; // unset margins
      padding: 0;
      background-size: 16px 16px;
      color: transparent; // hide stock icons
      border: none;
    }
  }

  // FIXME: not for actual button widgets but for toolbar's separators
  // crazy: src/+/master/chrome/browser/ui/libgtkui/gtk_ui.cc#891
  button { // for active-tab borders
    border-width: 1px;
    border-style: solid;
    border-color: $solid_borders_color;
    background-color: $chrome_bg_color;
    color: $chrome_fg_color;
  }

  entry.chromium {
    &, &:focus { // overrides standard borders
      border-image: none;
      color: $chrome_fg_color;
    }

    background-color: rgba($chrome_fg_color, 0.06);
  }

  // internal region of toolbar's entry widget
  > textview.view, textview {
    background-color: rgba($chrome_fg_color, 0.06);
    color: $chrome_fg_color;
  }

  > menubar { background-color: $header_bg; }

  menu {
    background-color: $base_color;
    border-radius: 0;
    border: 1px solid if($variant == 'light', $solid_borders_color, $header_border);

    menuitem {
      border-radius: 0;
    }
  }
}

//
// Libre-Office
//

window.background:not(.solid-csd):not(.csd) {
  // reserved area at the most-right side of GtkMenuBar
  > grid.horizontal > grid.horizontal {
    background-color: $header_bg;
    box-shadow: inset 0 -1px $borders_color;

    > button.flat.small-button {
      // 'close' button
      color: $header_fg;
      border: none;
      border-radius: 50px;
      background-image: none;

      &:hover {
        background-color: rgba($header_fg, 0.15);
        color: lighten($header_fg, 5%);
      }

      &:active,
      &:checked {
        background-color: rgba(red, 0.65);
        color: white;
      }

      &:disabled {
        color: rgba($header_fg, 0.6);
      }
    }
  }

  // for 'Notebookbar' toolbar
  > notebook {
    border: none; // unset borders
    background-color: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0;

    > stack {
      border: 1px solid $borders_color;
      background-color: $base_color;
      box-shadow: none;
      border-radius: $bt_radius;
    }

    > header {
      box-shadow: none;
      border-radius: $bt_radius;
      padding: 0;
      margin: 0;
      border: none;
      background-color: transparent;

      > tabs > tab {
        margin: 3px 1px;
        border-radius: $bt_radius;
        border: none;
        box-shadow: none;

        &:hover {
          background-color: rgba($fg_color, 0.1);
        }

        &:active {
          background-color: rgba($fg_color, 0.2);
        }

        &:selected {
          background-color: rgba($fg_color, 0.15);
        }
      }
    }
  }
}

window.background:not(.solid-csd) {
  > grid.horizontal > widget > widget {
    viewport.frame > box > box > box > grid toolbar {
      background-color: transparent;
      border: none;
      padding: 3px;
    }

    > scrolledwindow > viewport.frame {
      > grid > box.vertical {
        > toolbar {
          background-color: transparent;
          border: none;
          padding: 6px;
        }
      }

      > grid > box.horizontal > #combobox.linked,
      > grid > box.horizontal > grid.horizontal > box.horizontal { background-color: $base_color; }
    }

    toolbar.small-button {
      border: none;
    }
  }
}

#combobox.linked {
  > entry.combo {
    border: 1px solid $dark_borders_color;
    border-right: none;

    &:focus {
      border-color: $entry_highlight;
      @if $variant == 'dark' { box-shadow: inset 0 0 0 1px $entry_highlight; }
      @if $variant == 'light' { box-shadow: 0 1px 1px 0 transparent, inset 0 0 0 1px $entry_highlight; }

      + button.combo {
        border-left-color: $entry_highlight;
      }
    }

    &:drop(active) {
      border-color: $drop_target_color;
      @if $variant == 'dark' { box-shadow: inset 0 0 0 1px $drop_target_color; }
      @if $variant == 'light' { box-shadow: 0 1px 1px 0 transparent, inset 0 0 0 1px $drop_target_color; }
    }
  }
}

// Fix libreoffice toolbar button background color
toolbar.toolbar {
  box:not(.linked) > button {
    &:active {
      color: $fg_color;
      background-color: if($variant == 'light', mix(black, $bg_color, 10%), mix(white, $bg_color, 10%));
      border-color: transparent;
    }

    &:checked {
      color: $fg_color;
      background-color: if($variant == 'light', mix(black, $bg_color, 5%), mix(white, $bg_color, 5%));
      border-color: transparent;
    }

    &:disabled {
      color: $disabled_fg_color;

      label {
        color: $disabled_fg_color;
      }
    }
  }
}

//
// Tilix
//

// in-line titlebars
widget > box.terminal-titlebar {
  padding: 0 6px;

  > button.flat.popup.toggle {
    border: none;
    border-radius: 0;
    padding-top: 0;
    padding-bottom: 0;

    &:dir(ltr) { padding-right: 6px; }
    &:dir(rtl) { padding-left: 6px; }

    &:hover, &:checked, &:active {
      border-radius: 0;
    }

    &:checked, &:active {
      background-color: rgba($fg_color, 0.05);
      color: $fg_color;
    }
  }

  > button.image-button { // 'plus' and 'close'
    &, &.toggle {
      margin: 2px 0;
      padding: 0;
      min-height: 24px;
      min-width: 24px;
      border-radius: $bt_radius;
      // -gtk-outline-radius: $bt_radius;
    }
  }
}

list.tilix-session-sidebar {
  // use -image property instead
  background-image: image($dark_sidebar_bg);
  border-bottom-left-radius: $wm_radius;

  button.tilix-sidebar-close-button {
    min-height: 28px;
    min-width: 28px;
    padding: 0;
    margin: 0;
    border-radius: 100px;
    // -gtk-outline-radius: 100px;
    background-color: $destructive_color;
    &, &:hover, &:active, &:checked { color: white; }

    &:hover { background-color: lighten($destructive_color, 10%); }

    &:active,
    &:checked { background-image: image(darken($destructive_color, 10%)); }
  }
}

$tilix_bg: if($variant == 'light', #ffffff, #151515);

window.background.csd {
  > box.horizontal > stack {
    > box.vertical > notebook > stack {
      border-bottom-right-radius: $wm_radius;
    }
  }

  > overlay > notebook > stack > .tilix-background {
    background-color: $tilix_bg;
    border-radius: 0 0 $wm_radius $wm_radius;

    > .tilix-background {
      background-color: $tilix_bg;
      border-radius: 0 0 $wm_radius $wm_radius;

      .tilix-terminal-scrolledwindow {
        padding-bottom: $wm_radius;
        background-color: $tilix_bg;
        border-radius: 0 0 $wm_radius $wm_radius;

        > vte-terminal {
          border-radius: 0 0 $wm_radius $wm_radius;
        }
      }
    }
  }

  &.maximized, &.tiled, &.fullscreen {
    > box.horizontal > stack {
      > box.vertical > notebook > stack {
        border-bottom-right-radius: $maximized_radius;
      }
    }
  }
}

notebook.tilix-background {
  > header {
    > tabs > tab {
      button.tilix-small-button {
        padding: 0; // not use ?
        min-height: 16px;
        min-width: 16px;
      }
    }
  }
}

//
// Lollypop
//
window.background.csd {
  > grid.vertical > overlay > grid.vertical {
    > grid.horizontal {
      > .sidebar {
        border-bottom-left-radius: $wm_radius;
      }

      > paned.horizontal > stack {
        border-bottom-right-radius: $wm_radius;
      }
    }
  }

  &.maximized, &.tiled, &.fullscreen {
    > grid.vertical > overlay > grid.vertical {
      > grid.horizontal {
        > .sidebar {
          border-bottom-left-radius: $maximized_radius;
        }

        > paned.horizontal > stack {
          border-bottom-right-radius: $maximized_radius;
        }
      }
    }
  }

  revealer.default-banner {
    > overlay > box > entry.search {
      background-color: rgba(white, 0.06);
      &, image { color: rgba(white, 0.85); }

      &:focus {
        &, image { color: white; }
        background-color: rgba(white, 0.1);
      }
    }
  }
}

//
// Inkscape
//

toolbar#SubToolBox {
  min-height: 36px;

  entry, button {
    margin-top: 6px;
    margin-bottom: 6px;
  }

  > toolbutton > button.flat {
    margin-left: 2px;
    margin-right: 2px;
  }
}

box#SubToolbox {
  background-color: $base_color;
}

widget#ToolboxCommon {
  background-color: $base_color;

  button.flat {
    &:active {
      background-color: rgba($fg_color, 0.25);
    }

    &:checked {
      background-color: rgba($fg_color, 0.15);
    }
  }

  > #CommandsToolbox {
    border-bottom: 1px solid $borders_color;

    > toolbar {
      background: none;
      border: none;
    }
  }

  > toolbar#ToolToolbar { // Left side toolbar
    background-color: $bg_color;
    border-right: 1px solid $borders_color;
  }

  // > toolbar > toolitem > button.flat, // Left side
  > toolbar > toolbutton > button.flat { // Right side
    margin-top: 2px;
    margin-bottom: 2px;
  }
}

// Right side toolbar
box#SnapToolbox {
  background-color: $bg_color;
  border-left: 1px solid $borders_color;

  > toolbar {
    background-color: transparent;

    > toolbutton > button.flat { // Right side
      margin-top: 2px;
      margin-bottom: 2px;
    }
  }
}

box#DesktopStatusBar {
  spinbutton, button.combo, button.flat {
    margin-top: $container_padding * 1.5;
    margin-bottom: $container_padding * 1.5;
  }
}

scrolledwindow#DialogNotebook {
  > viewport.frame {
    border: 1px solid $borders_color;

    button.close-button {
      margin: 4px 0;
      border-radius: $circular_radius;

      &, &:hover, &:active { background-color: transparent; }
    }

    notebook.frame { margin-top: -1px; }
  }
}

grid#CanvasGrid {
  > button:not(.flat) {
    @extend %flat_button;
    border-radius: 3px;

    &:active {
      background-color: rgba($fg_color, 0.25);
    }

    &:checked {
      background-color: rgba($fg_color, 0.15);
    }
  }
}

dialog.background {
  > box.dialog-vbox > filechooser {
    > actionbar > revealer > box > box > box > combobox {
      margin-top: 28px;
      margin-bottom: 28px;
    }
  }
}

treeview#ObjectsTreeView.view {
  transition: none;

  &:selected {
    background-color: rgba($selected_bg_color, 0.35);
    color: $fg_color;
  }
}

//
// GIMP
//

GimpSpinScale {
  > entry {
  }

  > button {
    @extend %flat_button;
    margin-left: $container_padding / 2;
  }
}

GimpDock {
  combobox {
    button.combo arrow {
      margin: 2px 0;
    }
  }

  spinbutton {
    > entry { border-radius: $bt_radius 0 0 $bt_radius; } // Not Work
  }
}

//
// Synaptic
//
window > box.vertical > box.horizontal {
  > toolbar {
    background-color: transparent;
    box-shadow: none;

    toolitem > box {
      label,
      entry {
        min-height: 20px;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 90%;
      }

      > label { color: $fg_color; }
    }
  }

  > widget { background-color: transparent; }
}

//
// Pamac
//
window.background > box.vertical > overlay > stack > scrolledwindow.frame {
  border: none;

  > viewport.frame > box.vertical > stack > scrolledwindow {
    border-top: 1px solid $borders_color;
  }
}

//
// vala-panel
//
window#ValaPanel.background {
  widget.-vala-panel-background {
    > separator { // separator applet
      background: none;
    }
  }

  button.flat.-panel-button,
  button#tasklist-button.toggle.flat,
  button.flat.-panel-icon-button {
    @extend %panel_button;
  }
}

// vala-panel-appmenu
menubar.-vala-panel-appmenu-private, // xfce4 appmenu plugin
menubar.-vala-panel-background {
  background: none;
  border: none;
  box-shadow: none;

  > menuitem {
    color: $panel_fg;
    font-weight: normal;

    &:hover {
      color: $panel_fg;
      background-color: rgba($panel_fg, 0.2);
    }

    &:disabled {
      color: transparentize($panel_fg, 0.6);
    }

    // > window.background.popup > decoration,
    // > window.background.popup > menu { border-radius: 0 0 $wm_radius $wm_radius; }
  }
}

//
// xapp stutas icon menu
//
.xapp-status-icon-menu-window {
  > decoration {
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.15), 0 8px 15px rgba(0, 0, 0, 0.08), $wm_outline;
    transition: none;
    margin: 0;
  }

  > menu {
    padding: $container_padding;

    > menuitem {
      border-radius: $bt_radius;

      > window > decoration {
        box-shadow: none;
        transition: none;
        margin: 0;
      }
    }
  }
}

//
// Drawing
//

window.background.csd {
  > box.vertical > box.horizontal > notebook.frame {
    border: none;
  }
}

//
// Cinnamon setting
//

frame.view list > row {
  button.gtkstyle-fallback {
    padding: $container_padding;

    > image { border-radius: 3px; }
  }
}

//
// FileZilla
//

window.background:not(.csd) {
  > box > widget > widget > widget > widget > widget > widget > widget > scrolledwindow {
    entry:focus {
      background-color: if($variant == 'light', mix(black, $bg_color, 5%), mix(white, $bg_color, 5%));
    }
  }
}